<template>
  <!-- 分类页面顶部搜索框 -->
  <!-- 
    van-sticky，固定在顶部
    van-search，搜索框组件
    shape，控制搜索框圆角
    -->
  <van-sticky>
    <van-search v-model="searchData" shape="round" placeholder="等你来拿">
      <!-- 
        slot，搜索框外左侧的插槽
       -->
      <van-icon slot="left" name="wap-home-o" size="25" class="icon-home" @click="goHome('/home')" />
    </van-search>
  </van-sticky>
</template>
<script>
export default {
  name: "Search",
  data() {
    return {
      searchData: ""
    };
  },
  methods: {
    goHome(path) {
      this.$router.replace(path);
    }
  },

  components: {}
};
</script>
<style lang="less" scoped>
.van-search__content {
  background-color: #ccc;
}
.van-search {
  padding: 5px 12px;
  .van-cell {
    padding: 3px 8px 3px 0;
  }
}
.icon-home {
  margin-right: 5px;
}
</style>
